<extend name="Public:base" />
<block name="content">
<style type="text/css">
.tree .tree-item.active{
    background: #eee;
}    
</style>
<Widget:show col="3" title="配置文件">
    <div class="tree tree-plus-minus tree-solid-line tree-unselectable">
        <div style="display: block;" class="tree-item">
            <i class="tree-dot"></i>
            <div class="tree-item-name">
            <a href="{:U("ApiColud/index?key=widget&t=widget&apid=$apid")}">widget</a>
            </div>
        </div>
    <volist name="data" id="d">
        <div class="tree-folder"> 
        <div class="tree-folder-header"><i class="fa fa-folder-open"></i> 
            <div class="tree-folder-name">{$key}
                <div class="tree-actions"><i class="fa fa-plus green"></i>
                </div>
            </div> 
        </div> 
        <div class="tree-folder-content">
            <if condition="($key eq 'sdk')">
            <volist name="data[$key]" id="kk">
            <div data-key="{$key}"  class="tree-item"><i class="tree-dot"></i> 
                <div class="tree-item-name">
                    <a href="{:U("ApiColud/index?key=$key&t=$kk[pid]&apid=$apid")}">{$key}</a>
                </div> 
            </div>
            </volist>

            <else/>

            <volist name="data[$key]" id="kk">
            <div data-key="{$kk.fname}" class="tree-item"><i class="tree-dot"></i> 
                <div class="tree-item-name">
                <a href="{:U("ApiColud/index?key=$key&t=$kk[pid]&apid=$apid")}">{$kk.fname}</a>
                </div> 
            </div>
            </volist>
            </if>
        </div> 
        </div>
    </volist>
    </div>
</Widget:show>
<Widget:show col="8" title="配置文件">
<Widget:action  >
    <a target="_blank" href="{:U("ApiColud/downCfg?apid=$apid")}">下载配置文件</a>
</Widget:action>
<notempty name="field">
    <form action="{:U("ApiColud/saveCfg?apid=$apid")}" method="post">
    <input type="hidden" name="apid" value="{$apid}">
    <input type="hidden" name="t" value="{$field.pid}">
    <input type="hidden" name="key" value="{$field.fname}">
    <div class="row">
        <Ui:field col="12" label="{$field[fname]}" value="{$field.value}" name="{$field[fname]}" ></Ui:field> 
    </div>
    <button ajax-submit type="submit" class="btn btn-blue">保存</button>
    </form>
</notempty>
</Widget:show>
<script type="text/javascript">
$(function(){
    $('[data-key={$Think.get.key}]').addClass('active');
    $('.tree-folder-header>i').on('click',function(){
        var i = $(this);
        var par = $(this).parent().parent();
        if (i.hasClass('fa-folder')) {
            i.removeClass('fa-folder').addClass('fa-folder-open');
            par.find('.tree-folder-content').show();
            par.find('.tree-item').show();
        }else if (i.hasClass('fa-folder-open')) {
            i.removeClass('fa-folder-open').addClass('fa-folder');
            par.find('.tree-folder-content').hide();
            par.find('.tree-item').hide();

        };
    })
})    
</script>
</block>